import { Directive, HostBinding, Input, HostListener } from '@angular/core';
import { Router, ActivatedRoute } from '@angular/router';

@Directive({
  selector: '[mDetailRouterLink]',
})
export class DetailRouterLinkDirective {
  constructor(private router: Router, private route: ActivatedRoute) {}
  private param: DetailRouterParam;
  @Input('mDetailRouterLink') set detailLinkParam(param: DetailRouterParam) {
    switch (param.type) {
      case 'admin':
        param.path = ['settings', 'admin'];
        break;
      case 'web_message':
        param.path = ['message', 'web', 'all'];
        break;
      case 'task':
        param.path = ['task', 'history'];
        break;
      default:
        param.path = [param.type];
    }
    if (!param.name) {
      param.name = param.id.toString();
    }
    this.link = `/${param.path.join('/')}/detail/${param.name}?id=${param.id}&area_id=${param.area_id}`;
    this.param = param;
  }
  @HostBinding('attr.href') link = '';
  @HostListener('click', ['$event']) click(event: Event) {
    event.stopPropagation();
    event.preventDefault();
    this.router.navigate(['/', ...this.param.path, 'detail', this.param.name], {
      queryParams: { id: this.param.id, area_id: this.param.area_id },
    });
  }
}

interface DetailRouterParam {
  type: 'zone' | 'personnel' | 'software' | 'computer' | 'admin' | 'web_message' | 'task';
  id: number;
  name: string;
  path?: string[];
  area_id?: number;
}
